/**
 * Created by fxy on 2017/6/4.
 */


var chart;
$(document).ready(function () {
//折线图示例
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'table_img',          //放置图表的容器
            plotBackgroundColor: null,
            plotBorderWidth: null,
            defaultSeriesType: 'line'
        },
        title: {
            text: '王者联盟数据统计图'
        },
        subtitle: {
            text: ''
        },
        xAxis: {//X轴数据
            categories: ['5分钟', '10分钟', '15分钟', '20分钟', '25分钟'],
            labels: {
                rotation: -45, //字体倾斜
                align: 'right',
                style: {font: 'normal 13px 宋体'}
            }
        },
        yAxis: {//Y轴显示文字
            title: {
                text: '产量/百万'
            }
        },
        tooltip: {
            enabled: true,
            formatter: function () {
                return '<b>' + this.x + '</b><br/>' + this.series.name + ': ' + Highcharts.numberFormat(this.y, 1);
            }
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true
                },
                enableMouseTracking: true//是否显示title
            }
        },
        series: [{
            name: '队伍一',
            data: [7.0, 6.9, 9.5, 14.5, 18.4]
        }, {
            name: '队伍二',
            data: [4.0, 2.9, 5.5, 24.5, 18.4]
        }, {
            name: '队伍三',
            data: [14.0, 12.9, 15.5, 14.5, 28.13]
        }, {
            name: '队伍四',
            data: [3.9, 4.2, 5.7, 8.5, 11.9]
        }, {
            name: '队伍五',
            data: [4, 4.0, 9.9, 2.8, 1.9]
        }, {
            name: '队伍六',
            data: [3, 2, 2.7, 6.5, 4.9]
        }, {
            name: '队伍七',
            data: [1.9, 6.2, 1.7, 2.5, 1.9]
        }, {
            name: '队伍八',
            data: [7, 9, 4, 5, 11]
        }, {
            name: '队伍九',
            data: [3, 2, 5, 5, 9]
        }, {
            name: '队伍十',
            data: [3.1, 4.3, 5, 5, 11]
        }],
    });
});


function shownum(i) {
    //表格排名
    var str = '<tr><th>排名</th><th>团队名</th><th>得分</th></tr>';
//        ajax获取数据
    var teamnum = '';
    var teamname = '';
    var teamcoal = '';
    for (var j = i; j < i + 10; j++) {
        teamnum = '第' + j;
        teamname = '队伍' + j;
        teamcoal = j + '分';
        str += '<tr><td>' + teamnum + '</td><td>' + teamname + '</td><td>' + teamcoal + '</td></tr>'
    }
    document.getElementById('total_table').innerHTML = str;

    var strd = '<tr><th>团队名称</th><th>题目1</th><th>题目2</th><th>题目3</th>' +
        '<th>题目4</th><th>题目5</th><th>题目6</th><th>题目7</th><th>题目8</th>' +
        '<th>题目9</th><th>题目10</th><th>题目11</th></tr>';
    var teamnumd = '';
    var teamnamed = '';
    for (var k = i; k < i + 10; k++) {
        teamnamed = '队伍' + k;
        var strdk = '<tr><td>' + teamnamed + '</td>';
        var strdh = '';
        for (var h = 0; h < 11; h++) {
            coal = 'coal' + h;
            strdh += '<td>' + coal + '</td>';
        }
        strd += strdk + strdh + '</td>'
    }
    document.getElementById('detail_table').innerHTML = strd;

    //重绘图标
    chart = new Highcharts.Chart({
        chart: {
            renderTo: 'table_img',          //放置图表的容器
            plotBackgroundColor: null,
            plotBorderWidth: null,
            defaultSeriesType: 'line'
        },
        title: {
            text: '王者联盟数据统计图'
        },
        subtitle: {
            text: ''
        },
        xAxis: {//X轴数据
            categories: ['5分钟', '10分钟', '15分钟', '20分钟', '25分钟'],
            labels: {
                rotation: -45, //字体倾斜
                align: 'right',
                style: {font: 'normal 13px 宋体'}
            }
        },
        yAxis: {//Y轴显示文字
            title: {
                text: '产量/百万'
            }
        },
        tooltip: {
            enabled: true,
            formatter: function () {
                return '<b>' + this.x + '</b><br/>' + this.series.name + ': ' + Highcharts.numberFormat(this.y, 1);
            }
        },
        plotOptions: {
            line: {
                dataLabels: {
                    enabled: true
                },
                enableMouseTracking: true//是否显示title
            }
        },
        series: [{
            name: '队伍十一',
            data: [7.0, 6.9, 9.5, 14.5, 18.4]
        }, {
            name: '队伍二',
            data: [4.0, 2.9, 5.5, 24.5, 18.4]
        }, {
            name: '队伍三',
            data: [14.0, 12.9, 15.5, 14.5, 28.13]
        }, {
            name: '队伍四',
            data: [3.9, 4.2, 5.7, 8.5, 11.9]
        }, {
            name: '队伍五',
            data: [4, 4.0, 9.9, 2.8, 1.9]
        }, {
            name: '队伍六',
            data: [3, 2, 2.7, 6.5, 4.9]
        }, {
            name: '队伍七',
            data: [1.9, 6.2, 1.7, 2.5, 1.9]
        }, {
            name: '队伍八',
            data: [7, 9, 4, 5, 11]
        }, {
            name: '队伍九',
            data: [3, 2, 5, 5, 9]
        }, {
            name: '队伍十',
            data: [3.1, 4.3, 5, 5, 11]
        }],
    });
}